<template>
  <div class="home">
    <!-- <button @click="onClick">点击Loading</button> -->
    <!-- <button @click="onClick">点击message</button> -->
    <!-- 首页1 -->
    <!-- <router-view></router-view> -->
    <Content>

    <Swiper :imges="imges"></Swiper>
    <Button :data="imgs"></Button>
      <div class="list" @click="tokanjia">
        <div class="kanjia_list_top">
          <p>全民砍价  </p>
        <img src="../assets/dibudaohanglan-.png" />
        </div>
        <List :list="list"></List>
      </div>
         <div class="list" >
        <div class="kanjia_list_top">
          <p>精选专题</p>
          <img src="../assets/dibudaohanglan-.png" />
        </div>
        <ScrollSwiper :date="scrollSwiper"></ScrollSwiper>
      </div>
       <div class="list" >
        <div class="kanjia_list_top">
          <p>人气推荐</p>
          <img src="../assets/dibudaohanglan-.png" />
        </div>
       <ShopList :data='copylist'></ShopList>
      </div>
      
    </Content>
        
  </div>
</template>

<script>


import Swiper from "../components/swiper/Swiper";
import Button from "../components/iconButton/VantButton";
import List from "../components/Homelist/List";
import ScrollSwiper from '../components/scrollSwiper/scrollSwiper'
import ShopList from '../components/shoplist/ShopList';
import Content from "../components/content/Content";
export default {
  components: {
  
  Content,
  Swiper,
  Button,
  List,
  ScrollSwiper,
  ShopList
  },
  data() {
    return {
      imges:[],
       imgs: [
        {
          img:
            "https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3028081940,176326627&fm=26&gp=0.jpg",
          title: "签到",
          path: "/fenye1",
        },
        {
          img:
            "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3874067489,2447793058&fm=11&gp=0.jpg",
          title: "礼券",
          path: "/fenye2",
        },
        {
          img:
            "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2434275874,1205034551&fm=26&gp=0.jpg",
          title: "砍价",
          path: "/fenye3",
        },
        {
          img:
            "https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2622933625,920552892&fm=26&gp=0.jpg",
          title: "专栏",
          path: "/fenye4",
        },
      ],
      list:[],
      scrollSwiper:[],
      copylist:[],
    };
  },
  methods: {
    // onClick() {
    
    //   // 点击弹loading
    //   // this.$Loading();
 
   
  },  
  methods: {
  tokanjia() {
      this.$router.pushRouteByQuery("/kanjia");
    },
  },
  mounted() {
    this.$APIClient.swiper().then((res)=>{
      // console.log(res);
      this.imges = res.data.data
    })
       this.$APIClient.getlist().then((res) => {
      // console.log(this.list);
      this.list = res.data.data;
      this.list = this.list.slice(5, 8);
       this.copylist = res.data.data.slice(8, 12);
    });
     this.$APIClient.getScrollSwiper().then(res=>{
      // console.log(res);
      this.scrollSwiper = res.data.data
    }) 
  },
};
</script>
<style lang="scss" scoped>
  .kanjia_list_top {
  height: 40px;
  // line-height: 40px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  img {
    width: 0.6rem;
    height: 0.6rem;
  
    margin-left: 0.5rem;
  }
  p {
    font-size: 0.7rem;
    margin-top: 0.5rem;
  }
}
</style>
